body
	background-color : white !important
	overflow-y       : scroll

	#main
		background-color : $mainbgcolor
		font-family      : $mainfont !important
		font-size        : $mainfs
		width            : $mainwidth

		#content
			width : $contentwidth
			margin : 0 auto !important

		.menuWrapper
			width : $contentwidth
			margin : 0 auto


#notificationsHolder
	width: 300px
	text-align: center
	color: white
	position: fixed
	z-index: 1000

	.notification
		background-color: $lightgray
		border-radius: 5px
		padding: 5px
		font-size: $mediumfs
		margin: 2px
		display: none
		box-shadow: 3px 3px 6px black


#commonInfo
	height : 14px
	background-color : #D9DBDA

#gigaBox
	background-color : $blue
	padding          : 20px 18px 10px 18px

	#giga
		margin-right     : 12px
		width            : 60px
		height           : 17px
		position         : relative
		top              : 4px
		background-image : url(../../images/giga.png)

	#search
		#searchField
			width: 600px
			-webkit-border-radius : 6px
			-moz-border-radius    : 6px
			border-radius         : 6px

	#addMartAd
		ul
			padding-left : 45px
			position : relative
			top : 1px

			li
				display : inline-block
				padding-left : 22px

				a
					color           : $light
					text-decoration : none
					margin-right    : 26px
					font-weight     : bold
					font-size       : $smallfs

				a:hover
					text-decoration: underline
					  
		#addMart
			background : url(../../images/icons/add-company.png) no-repeat 3px
		#addAd
			background : url(../../images/icons/add-ad.png) no-repeat 3px
	#underSearchMenu
		ul
			margin-left : 300px
			margin-bottom: 0px
		  
			li
				display : inline-block

				a
					color : $light
					font-size : $minifs
					
				a:hover
					text-decoration : none

#userMenu
	background-color : $darkgray

	ul
		padding   : 6px 14px
		margin    : 0
		display   : inline-block
		font-size : $mediumfs
		
		li
			padding      : 0 10px 0 6px
			border-right : 1px dotted $light
			display      : inline-block

			a
				color           : $light
				text-decoration : none

			span
				color : $light

#registrationContentHolder
	display: none
	border-bottom : 1px solid $darkgray

#mainMenu
	padding    : 34px 0 30px 0
	border-bottom: 1px solid #c6c6c6

	ul
		li
			width          : 110px
			height         : 2em
			text-align     : center
			font-size      : 14px
			line-height    : 2em

			div
				display : none

			a
				color           : $black
				text-decoration : none

			&.active, &:hover
				background-color      : $lightgray
				-webkit-border-radius : 5px
				-moz-border-radius    : 5px
				border-radius         : 5px

				div
					display: block

			&.menuItem
				.arrow
					width       : 28px
					height      : 9px
					margin-left : 41px
					position    : absolute
					background  : url(../../images/icons/itemArrow.jpg) no-repeat

				.count
					width     : 110px
					margin    : 4px 0
					font-size : $smallfs
					position  : absolute

			&.leftMenuItem, &.rightMenuItem
				width: 134px

			&.leftMenuItem:hover, &.leftMenuItemActive
				background : url(../../images/icons/leftItemArrow.jpg) no-repeat 125px 0 $lightgray


			&.rightMenuItem:hover, &.rightMenuItemActive
				background : url(../../images/icons/rightItemArrow.jpg) no-repeat 0 0 $lightgray


.section
	clear: both

.sectionTitle
	padding          : 6px 24px
	color            : $black
	background-color : $lightgray

	a, a:hover, .link
		color: white
		font-size: 10px
		margin-left: 10px
		font-weight: bold
		text-decoration: underline

	.sectionCounter
		color: gray

.triangle
	width            : 28px
	height           : 9px
	margin-top       : 6px
	color            : $lightgray
	position         : absolute
	margin-left      : 45px
	background-image : url(../../images/icons/itemArrow.jpg)

.sectionContent
	padding : 40px

#bottomMenu
	border-top : 1px solid $gray
	padding    : 6px 0 90px 0
	margin     : 0 30px

	#socialNets
		width            : 106px
		height           : 31px
		display          : inline-block
		position         : relative
		top              : 10px
		background-image : url(../../images/socialNets.jpg)

	ul
		padding   : 6px 12px
		margin    : 0
		display   : inline-block
		font-size : $mainfs

		li
			padding      : 0 7px 0 4px
			border-right : 1px solid $darkgray
			display      : inline-block

			a
				color           : $darkgray
				text-decoration : none

#gigaButton
	width            : 88px
	height           : 27px
	margin           : -27px 40px
	float            : right
	cursor           : pointer
	position         : relative
	background-image : url(../../images/gigaButton.png)

.field-validation-error
	width       : 200px
	height      : 12px
	margin-left : 10px
	margin-top  : 4px
	position    : absolute
	color       : $errorcolor
	font-size   : $smallfs

.server-validation-error, .error
	font-size     : $mediumfs
	color         : $errorcolor

#user
	padding          : 0 40px
	background-color : orange
	font-weight      : bold

#personalUserMenu
	height           : 50px
	background-color : #D9DBDA
	color            : #828380
	font-size        : 11pt

	#expandUserInfoButton
		float       : left
		margin-left : 4px
		margin-top  : 17px
		cursor      : pointer

	#userSocialButton
		float       : left
		margin-left : 18px
		margin-top  : 16px

	#userNameBlock
		float       : left
		margin-top  : 15px
		margin-left : 10px

		#loginHolder
			font-size : 14px
			color     : black
			min-width : 50px
			max-width : 200px

		.online
			font-size : 10px
			float     : left
			position  : absolute
			top       : -3px

	#userMenuItems
		float       : left
		margin-top  : 13px
		margin-left : 23px

		ul
			display      : inline-block
			border-left  : 1px dotted $lightgray
			padding-left : 10px

			li
				list-style        : none
				list-style-images : none
				font-size         : 12px
				display           : inline-block
				padding           : 10px
				margin-left       : 15px
				padding-left      : 5px
				padding-top       : 3px
				padding-bottom    : 3px
				padding-right     : 5px

				a
					color           : $black
					text-decoration : none

				a:hover
					text-decoration : none

				.count
					color        : orange
					padding-left : 5px
					font-weight  : bold

			li:hover
				border           : none
				border-radius    : 5px
				background-color : white

			li.separator
				border-right : 1px dotted $lightgray
				margin-right : 5px
				margin-left  : 5px

			li.separator:hover
				border-radius    : none
				background-color : transparent

.toggleButton
	width            : 12px
	height           : 12px
	background-image : url(../../images/toggleButton.png)

.toggleButtonActive
	background-image : url(../../images/toggleButtonActive.png)

#userWorkbench
	background-color: $lightgray
	position: relative
	
	.workbenchRow
		display: none
		height: 100px
		clear: both
		position: relative
		padding-left: 10px
		padding-right: 5px

		.toggleNextRowButton
			position: absolute
			left: 4px
			top: 49px
			cursor: pointer

		.workbenchItem
			margin: 17px 10px
			margin-bottom: 10px
			float: left
			min-width: 64px
			height: 64px
			cursor: pointer

			.itemImage
				position: relative
				min-height: 64px
				min-width: 64px

				.updatesCount
					height: 24px
					width: 24px
					position: absolute
					background-color: orange
					border-radius: 12px
					line-height: 24px
					color: white
					font-size: $smallfs
					font-weight: bold
					z-index: 1000

			.itemText
				text-align: center
				font-size: $smallfs
				margin-top: 0px
				min-width: 82px
				line-height: 10px

				.itemTitle
					color: black

				.itemCount
					color: white
					font-weight: bold
					display: none


	#firstRow
		display: block

	#secondRow
		border-top: 1px solid white

	#thirdRow
		border-top: 1px solid white

#sitesNote
	background-color: $dark
	min-height: 22px
	border-bottom-left-radius: 5px
	border-bottom-right-radius: 5px
	padding-top: 3px
	padding-left: 5px
	padding-right: 5px
	clear: both

	.site
		margin: 2px 2px 2px 2px
		height: 16px
		width: 16px
		float: left

		img
			width: 16px
			height: 16px

// Styles for all pages of Catalog
.sectionContent
	.insideSectionContainer
		padding : 10px 60px

	.alphabet
		height        : 30px
		width         : $mainwidth
		margin        : 24px 0 0 -100px
		border-top    : 1px solid $gray
		border-bottom : 1px solid $gray
		position      : absolute
		color         : $darkgray

		.rusEng
			margin-left : 100px
			padding-top : 6px
			color       : $dark

			span
				cursor : pointer

			.activeLang
				color : $black
				font-weight: bold

			span:hover
				color : $black

		.abc
			margin-left : 65px
			font-size   : $mediumfs
			cursor      : default
			display     : none

		.abcActive
			display: inline-block

		.abcLetter
			margin-right : 16px
			cursor       : pointer

		.abcLetterActive
			color : $dark
			font-weight: bold
			text-decoration: underline
			background-color: $lightgray
			border-radius: 3px
			padding-left: 4px
			padding-right: 4px

		.abcLetter:hover
			color : $dark

		.all
			display: none




	.tab-content
		margin-top : 65px

		.gridHeader
			font-size      : $mainfs



.cardImage
	width         : 200px
	height        : 116px
	margin-bottom : 10px
	background    : $lightgray
	position      : relative
	box-shadow    : 3px 4px 5px #bdbdbd

	img
		height: 100%

.categoriesSelector
	color: #6CBDDF
	font-size: $mediumfs
	border-bottom: 0px solid $gray
	padding-bottom: 5px
	margin-bottom: 7px

	.category
		float: left
		padding-left: 11px
		margin-top: 4px
		margin-bottom: 4px
		margin-right: 30px
		width: 189px

		a
			text-decoration: none

		span
			line-height: 12px


		.categoryBullet
			font-weight: normal

		.categoryTitle
			margin-left: 3px

		.categoryTitle:hover
			border-bottom: 1px solid #6CBDDF

.breadcrumpItem
	padding: 3px

	a
		text-decoration: none
	a:hover
		text-decoration: underline

.breadcrumpSeparator
	padding: 3px

.page
	border-top: none

	.navigationChain
		margin-top: 10px
		margin-left: 15px

		.navigationChainItem
			color: $lightblue
			font-size: $mediumfs
			padding: 3px

			a
				text-decoration: none

			a:hover
				text-decodarion: underline

		.navigationItemSeparator
			color: $lightblue

	.topBar
		clear: both
		font-size: $largefs
		padding-right: 30px

		a
			text-decoration: underline

		.add
			float: right

	.tabs
		clear: both
		margin-top: 30px

		ul
			padding-left: 0px
			margin-bottom: 0px

	#AdsTabs
		li
			min-width: inherit !important
			
			a
				padding-right: 20px
				padding-left: 20px
				
		li:last-child
			float: right

			a
				margin-right: 0px

	.categories
		clear: both
		margin-top: 25px
		margin-left: 15px
		margin-right: 15px
		margin-bottom: 25px

		.category
			width: 300px
			float: left
			margin-right: 65px
			padding: 4px

			.categoryTitle
				float: left
				font-size: $mediumfs

			.categoryItemsCount
				float: right
				padding-right: 15px
				color: grey

		.category:hover
			background-color: $lightblue
			color: white

			a, a:hover
				color: white
				text-decoration: none

	.dynamicCategories
		margin: 40px 0px

		.categoriesColumn
			float: left
			width: 346px
			padding-top: 10px
			padding-bottom: 10px

		.firstColumn
			padding-right: 15px

		.secondColumn
			padding-left: 15px
			padding-right: 15px

		.thirdColumn
			padding-left: 15px

		.dynamicCategory
			border-top: 1px solid $gray
			min-height: 45px

			.categoryTitle
				padding: 0px 7px
				font-size: $largefs
				padding-top: 10px
				padding-bottom: 10px

			.categoriesDetailsToggle
				float: right
				margin-top: 18px
				margin-right: 5px

			.categoryStatistic
				margin-left: 25px
				margin-bottom: 10px
				font-size: $mediumfs
				color: $darkgray

				td
					padding-right: 7px

		.dynamicCategory:last-child
			border-bottom: 1px solid $gray

	.containerWrapper
		margin-bottom: 15px

	.searchContainer
		position: relative
		padding-top: 20px
		padding-bottom: 10px
		padding-left: 15px
		height: 30px
		background-color: $lightergray
		margin-bottom: 10px

		#containerSearch
			border-radius: 6px
			width: 380px
			height: 13px
			border-color: #E5E5E5

		#containerSearchButton
			position: absolute
			background-color: transparent
			width: 35px
			height: 23px
			margin: 0
			border: 0
			left: 375px
			background: url("/Content/images/smallSearchButton.png") top left no-repeat

	.tabHeader
		font-size      : $mainfs
		color          : $dark
		padding        : 0 0 2px 20px
		border-bottom  : 1px solid $gray
		clear: both

	.overview
		padding: 0

	.prevNext
		font-size      : $smallfs
		letter-spacing : 0
		position       : relative
		bottom         : 6px
		margin-right   : 17px

		.prev
			margin-right : 10px
			display      : inline-block
			cursor       : pointer

		.next
			margin-left : 10px
			display     : inline-block
			cursor      : pointer

		.bddv
			position : relative
			top      : 4px

	.bannerList
		margin-top : 30px

	.paginator
		height       : 26px
		margin-top   : 40px
		padding-left : 20px
		border       : 1px solid $gray
		color        : $dark
		font-size    : $smallfs

		.pages
			height       : 22px
			padding      : 4px 20px 0 0
			border-right : 1px solid $gray

		.showed
			padding-left : 20px

		.current
			font-weight : bold

		.prevNext
			margin    : 5px 16px
			font-size : $smallfs

	.recommendWrapper
		border-bottom: 1px solid $gray
		margin-bottom: 10px

	ul.recommendations
		display: inline-block
		list-style: none
		font-size: $mediumfs
		padding-bottom: 10px
		margin-bottom: 0px
		width: 100%

		li
			display: inline-block
			list-style: none
			margin-right: 20px

	.leftPane
		width: 235px
		vertical-align: top

		.currentCategory
			font-size: $largefs
			color: black
			margin-bottom: 15px

		.subCategories
			

			ul
				border: 1px solid $gray
				list-style: none
				margin: 0

				li.subTitle
					background-color: $lightergray
					color: $dark
					font-style: italic
					font-size: $mainfs

				li
					list-style: none
					list-style-image: none
					font-size: $mediumfs
					padding: 5px

					a
						text-decoration: none

					.itemsCount
						font-size: $smallfs
						color: $dark

	h3.title
		font-size: $largefs
		font-color: black
		margin-top: 20px
		margin-bottom: 10px
		margin-left: 15px
		font-weight: 600

	#categorySelector
		border-top: 1px solid $gray
		padding-left: 15px

		ul.categoryRow
			float: left
			border-right: 1px solid $gray
			list-style: none
			margin: 0px
			padding-right: 5px
			padding: 2px

			li
				cursor: pointer
				color: $lightblue
				padding: 4px 5px
				list-style: none
				min-width: 160px
				color: #1E72CA

			li:hover, li.active
				color: white
				background-color: #0686B7

			.categoryTitle
				float: left

			.categoryBullet
				float: right
				font-size: 9px

	.bigBrownBox
		background-color: $dark
		color: $lightgray
		font-weight: bold
		font-size: $mediumfs

	#categoryPath
		margin-top: 15px
		padding-top: 20px
		padding-bottom: 20px
		padding-left: 100px

		#selectedPath
			color: #8ADDFD

	.adsForm
		background-color: #F6F7FB
		padding: 20px 0px

		h3
			margin-left: 0px

		.adsSection
			padding-left: 125px
			padding-right: 125px
			padding-top: 5px
			border-top: 1px solid $gray
			margin-left: 15px
			margin-right: 15px

		#Title, #Email, #Phone
			width: 450px

		.adsContent
			width: 600px
			height: 350px

		input
			margin-bottom: 3px

		.editor-label label
			color: #8F9092
			font-size: $mainfs
			font-weight: 300

		.editor-field
			margin-bottom: 15px

		.charsLeft
			font-size: $smallfs
			margin-left: 2px

		#submitHolder
			padding-top: 10px
			padding-left: 186px
			padding-bottom: 7px

			input[type='submit']
				border: none
				height: 45px
				width: 250px
				border-radius: 10px
				background-color: #00C0FF
				color: black
				line-height: 40px
				font-weight: bold

		#adsImages
			width: 450px

		ul.photoInputsHolder
			list-style: none

			li
				list-style: none
				display: inline-block
				margin-right: 15px
				margin-top: 10px
				position: relative
				width: 110px
				min-height: 120px
				border: 1px solid $gray
				border-radius: 5px
				padding: 5px

				div
					font-size: $minifs

				img.preview
					height: 100px
					width: 100px

	#Ads
		margin: 10px 15px

		$adsWidth: 400px

		ul.toolbar
			list-style: none
			display: inline-block
			margin-bottom: 15px

			li
				display: inline-block
				list-style: none
				margin-right: 15px
				cursor: pointer

		div.tableWrapper
			padding-top: 10px
			padding-bottom: 10px
			width: $adsWidth * 0.8
			border-top: 1px solid $gray
			border-bottom: 1px solid $gray

			table.infoBlock
				td:first-child
					padding-right: 80px
					font-size: $mediumfs

				.adsNumber
					font-size: $mediumfs
					font-weight: bold

				.adsViews
					font-size: $smallfs

				.priceHolder

					td
						padding-top: 15px

					td:last-child
						font-size: $largefs
						font-weight: bold

						.price
							font-weight: normal
							font-size: $mediumfs


		.adsContent
			margin-top: 30px
			margin-bottom: 30px
			width: $adsWidth
			overflow: hidden

		.imagesContainer
			float: right
			width: 385px
			margin-left: 30px
			margin-right: 200px

			.mainImage
				height: 285px
				text-align: center
				cursor: pointer
				background-color: white
				border: 1px solid $gray
				vertical-align: center

				img
					max-width: 385px
					height: 285px

			.smallImages
				width: 385px

				.smallImage
					float: left
					width: 124px
					height: 80px
					cursor: pointer
					text-align: center
					background-color: $lightgray
					margin: 2px

					img
						height: 80px

			.activeImage
				outline: orange solid 2px

		.contacts
			border-top: 1px solid $gray
			padding-top: 10px
			padding-left: 50px
			font-size: $largefs
			width: 270px
			margin-bottom: 25px

			div
				margin-top: 3px

	.topSection
		margin: 15px
		margin-top: 25px
		margin-left: 0px

		.topTitle
			margin-bottom: 10px

			.sectionImageHolder
				background-color: #BABABA
				border-radius: 5px
				padding: 3px 5px
				float: left

				img
					margin-top: 1px

			.sectionTitle
				font-size: $largefs
				background-color: white
				color: $dark
				margin-left: 8px
				margin-top: 10px
				padding: 0px
				font-weight: bold

				a
					color: $dark
					font-size: $largefs
					text-decoration: none
					font-weight: bold

				a:hover
					text-decoration: underline
					color: #0363ad

			.adsCount
				font-size: $smallfs
				margin-left: 2px
				margin-top: 5px
				color: $lightblue

		.topSectionContent
			margin-top: 5px

	.ads

		$adsWidth: 260px
		$adsHeight: 130px

		background-color: white
		border: 1px solid transparent
		float: left
		margin-right: 5px
		margin-bottom: 5px
		margin-top: 5px

		.adsImage
			height: $adsHeight
			width: $adsWidth
			overflow: hidden
			text-align: center

			img
				

		.adsTitle
			height: 35px
			font-size: $mainfs
			padding: 5px
			width: ($adsWidth - 10px)
			overflow: hidden
			font-weight: bold

			a
				text-decoration: none !important
				color: $dark

		.adsBackground
			background-image: url(../../images/adsFooter.png)
			height: 70px

		.adsFooter
			padding: 5px
			
			.adsViewsCount
				float: left
				color: $gray
				font-size: $minifs

			.adsPrice
				float: left
				color: gray
				font-size: $largefs
				font-weight: bold
				margin-right: 10px

			.adsButtons
				float: right

				.addFave
					width: 16px
					height: 16px
					background-image: url(../../images/addFaveInactive.png)
					cursor: pointer

				.zoomAdv
					width: 16px
					height: 16px
					background-image: url(../../images/zoom.png)
					cursor: pointer

				.addFaveActive
					background-image: url(../../images/fave.png)

				.removeFave
					width: 16px
					height: 16px
					background-image: url(../../images/removeFave.png)
					cursor: pointer


	.ads:hover
		border: 1px solid $gray

		.adsBackground
			background-image: none
			background-color: transparent

		.adsTitle
			a
				color: #0363ad

	.adsSubCats
		margin-left: 30px

		.ads
			margin-right: 0px
			margin-left: 10px

	.advs
		.ads
			margin-top: 0px
			margin-bottom: 20px

.bannerList
	li
		text-align : left
		font-size  : $mainfs

	.smallBanner
		display : inline-block

		span
			display : block

		a
			text-decoration : none
			color           : $dark

			.bannerImage
				width            : 160px
				height           : 110px
				margin-bottom    : 10px
				border-radius    : 5px
				background-image : url(../../images/smallBanner.jpg)
				box-shadow       : 3px 4px 5px #bdbdbd



			.blankCardPlace
				background-color : white
				border: 1px dashed gray

			.overlay
				position: absolute
				width            : 200px
				height           : 116px
				display          : none

				span
					position: absolute
					background-color: $lightgray
					opacity: 0.9
					padding: 2px
					line-height: 10px
					border-radius: 5px

					img
						width: 16px
						height: 16px

				.addRemoveButton
					right: 5px
					top: 4px
					cursor: pointer

				.zoomCard
					right: 5px
					bottom: 3px

				.addedCount
					bottom: 3px
					left: 5px
					font-size: $mainfs
					height: 16px
					line-height: 16px
					padding-left: 4px
					padding-right: 4px
					font-weight: bold


			.company
				font-weight : bold

			.orientation
				font-size : $smallfs

			img
				height: 100%